.overlay{
  /* 为什么不使用absolute 区别是什么 */
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
}

.overlay article{
  background: rgba(95, 117, 189, 0.8);
  text-align: center;
  line-height: 200px;
  position: relative;
  left: 50%;
  top: 50%;
  width: 300px;
  height: 200px;
  transform: translate(-150px,-100px);
}